<!doctype html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link rel="stylesheet" type="text/css" href="../../css/mui.css"/>
		<link href="../../css/mui.min.css" rel="stylesheet" />
		<link rel="stylesheet" type="text/css" href="../../css/general.css"/>
		<link rel="stylesheet" type="text/css" href="../../css/lcs-font.css"/>
		<style type="text/css">
			.main{
				width: 100%;
				margin: 0.4em auto;
				padding: 0 1.5em;
				display: flex;
				align-items: center;
				justify-content: center;
				flex-wrap: wrap;
				background-color: white;
			}
			.main>div{
				width: 50%;
				text-align: center;
				padding: 0.8em;
			}
			input{
				width: 100%;
				border: 0;
				text-align: center;
			}
			
			
			.mui-popover {
			    position: absolute;
			    z-index: 999;
			    display: none;
			    width: 80%;
			    left: 10%;
			    top: 50%;
				-webkit-transform: translateY(-50%);
			    transform: translateY(-50%);
			    -webkit-transition: opacity .3s;
			    transition: opacity .3s;
			    -webkit-transition-property: opacity;
			    transition-property: opacity;
			    -webkit-transform: none;
			    opacity: 0;
			    border-radius: 7px;
			    background-color: #f7f7f7;
			    -webkit-box-shadow: 0 0 15px rgba(0,0,0,.1);
			    box-shadow: 0 0 15px rgba(0,0,0,.1);
			}
			.mui-popover .mui-popover-arrow:after {
			    position: absolute;
			    top: 0px !important;
			    left: 0;
			    width: 1px !important;
			    height: 1px !important;
			    content: ' ';
			    -webkit-transform: rotate(45deg);
			    transform: rotate(45deg);
			    border-radius: 3px;
			    background: #f7f7f7;
			}
			.listdiv{
				width: 100%;
				overflow: hidden;
				overflow-y: auto;
				background-color: white;
				text-align: center;
				padding: 1em;
				margin: auto;
			}
			.padding05{
				padding: 0.5em;
			}
			.mainimg{
				margin: 0.5em;
			}
		</style>
	</head>

	<body>
		<header class="mui-bar mui-bar-nav hbg">
		    <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left colorw"></a>
		    <h1 class="mui-title">业绩提成</h1>
		    <div class="hicon mui-icon-right-nav mui-pull-right" id="addhy">
		    	<img src="../../img/add.png"/>
		    </div>
		</header>
		<div class="mui-content">
		    <div class="" id="">
			    <div class="main" id="listid">
			    	<div class="border-r border-b">
			    		业绩达（元）
			    	</div>
			    	<div class="border-b">
			    		提成(比例)
			    	</div>
			    </div>
		    	
		    </div>
		    <!--
            	作者：592176224@qq.com
            	时间：2019-01-17
            	描述：
         
		    <div class="footdiv">
		    <button type="button" class="mui-btn mui-btn-blue mui-btn-block">修改</button>
		    </div>
		       -->
		    <div id="popover" class="mui-popover">
			   <div class="listdiv">
			   		<div class="mainimg">
			   			<div class="mui-input-row border-b">
			   			    <label>业绩达（元）</label>
			   			    <input id="sell_money" type="number" placeholder="输入金额">
			   			</div>
			   			<div class="mui-input-row ">
			   			    <label>提成(比例)</label>
			   			    <input id="percent_point" type="number" placeholder="输入比例1-100">
			   			</div>
		   			</div>
		   			<div class="">
				   	<button type="button" id="subbut" class="mui-btn mui-btn-blue mui-btn-block">添加</button>
				   </div>
			   </div>
			</div>
		</div>
		<script src="../../js/jquery.min.js" type="text/javascript" charset="utf-8"></script>
		<script src="../../js/mui.min.js"></script>
		<script src="../../js/req.js" type="text/javascript" charset="utf-8"></script>
		<script src="../../js/muishow.js" type="text/javascript" charset="utf-8"></script>
		<script type="text/javascript">
			var rid = 0;
			window.onload = function(){
				mui.init();
				rid = getrequest().rid||0;
				console.log(rid);
				mui.plusReady(function(res){
					 var view = plus.webview.currentWebview();
					 rid = view.rid||0;
				})
				g("addhy").addEventListener('tap',function(e){
                	mui('#popover').popover('toggle',g("popover"));
                })
				
				
				g("subbut").addEventListener('tap',function(e){
					var sell = g("sell_money");
					var perc = g("percent_point");
					var data = {
						url:"/api/sell_percent/set",
						data:{
							access_token:acctoken(),
							sell_money:sell.value,
							percent_point:perc.value||0
						}
					}
					ajax(data,function(res){
						sell.value = "";
						perc.value = "";
						getpercent();
						mui('#popover').popover('toggle',g("popover"));
					})
					
                })
				getpercent();
			}
			
			function getpercent(){
				var data = {
					url:"/api/sell_percent/get_percent",
					data:{
						access_token:acctoken(),
					}
				}
				ajax(data,function(res){
					console.log(res);
					setpercent(res.data)
				})
			}
			function setpercent(list){
				var str = '<div class="border-r border-b">业绩达（元）</div>'+
		    				'<div class="border-b">提成(比例)</div>';
		    			if(list&&list.length > 0){
		    				list.forEach(function(item,index){
		    					str += '<div class="border-r border-b" onclick="delmember('+item.id+','+item.sell_money+')">'+
			    				item.sell_money+
					    		'</div><div class="border-b" onclick="beditmember('+item.id+','+item.sell_money+')">'+
					    		item.percent_point+	
					    		'</div>';
		    				})
		    			}
					g("listid").innerHTML = str;
				
			}
			
			function beditmember(id,str){
				//let titles = "请输入"+str+"的折扣:";
				mui.prompt('请输入达'+str+'的折扣:','','',["取消","确定"],function(e){
					if(e.index == 1){
						console.log(e.value);
						var data = {
							url:"/api/sell_percent/edit",
							data:{
								access_token:acctoken(),
								percent_id:id,
								sell_money:str,
								percent_point:e.value,
							}
						}
						ajax(data,function(res){
							mui.toast(res.msg);
							getpercent();
						})
					}
				})
				
			}
			
			function delmember(id,str){
				console.log(id)
				console.log(str)
			    mui.confirm('是否删除达'+str+'业绩提成', '', ['否', '是'], function(e) {
			        if (e.index == 1) {
			            console.log("删除提成",id);
			           	var data = {
			           		url:"/api/sell_percent/del",
			           		data:{
			           			access_token:acctoken(),
			           			percent_id:id,
			           		}
			           	}
			           	ajax(data,function(res){
			           		console.log(res)
			           		mui.toast(res.msg);
			           		getpercent();
			           	})
			            
			        }
			    })
			}
		</script>
	</body>

</html>